<template>
  <div class="resetPassword">
    <h1>忘记密码</h1>
    <!-- 输入手机号，调起手机号键盘 -->
    <van-field
        v-model="phone"
        type="tel"
        label-align="left"
        label="手机号"
        placeholder="请输入手机号"
    />
    <van-field
        v-model="sms"
        left
        clearable
        label="短信验证码"
        placeholder="请输入短信验证码"
    >
      <template #button>
        <van-button size="small" type="primary">发送验证码</van-button>
      </template>
    </van-field>
    <!-- 输入密码 -->
    <van-field
        v-model="password"
        type="password"
        label-align="left"
        label="密码"
        placeholder="请输入新密码"
    />
    <van-button type="primary" to="/" size="large">完成</van-button>
  </div>
</template>

<script>
// @ is an alias to /src

export default {
  name: "resetPassword",
  data() {
    return {
      // msg: "srtTravel",
      phone: "",
      sms: "",
      text: "",
      password: "",
    };
  },
}
</script>

<style scoped>
.resetPassword {
  position: absolute;
  top: 5rem;
  left: 2rem;
  right: 2rem;
}

.van-button--large {
  width: 80%;
  top: 20px;
}
</style>